<template>
  <div>
    <div id="zong">
      <div id="middle">
        <div id="pic">
          <img :src="url" alt="" />
        </div>
        <div id="wen">
          <div id="wen-left">
            <div id="left-top">
              <div id="top-jianame">{{ jiaarr.name }}</div>
              <div id="top-jiao">1</div>
              <div v-if="jiaarr.certificationStatus" id="top-v"></div>
            </div>
            <div id="lef-middle">
              <start :scorer="jiaarr.score"></start>
              <span>{{ jiaarr.score }}分</span>
            </div>
            <p>{{ price }}</p>
          </div>
          <div id="wen-right">
            <p></p>
            <p>< 100m</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import start from "./start.vue";
export default {
  components: { start },
  name: "dan",
  data() {
    return {
      price: 0,
      num: 0,
      url: this.jiaarr.jiaxiaoCoverList[0].imageUrl,
    };
  },
  comments: {
    start,
  },
  methods: {
    bian() {
      if (this.jiaarr.price == 0) {
        this.price = "面议";
      } else {
        this.price = "￥" + this.jiaarr.price;
      }
    },
    ur() {
      // console.log(this.jiaarr);
      // console.log(this.jiaolian);
      if (this.jiaarr) {
        this.url = this.jiaarr.jiaxiaoCoverList[0].imageUrl;
        // console.log("驾校图片");
      } else {
        // console.log("教练图片");
        // this.url = this.jiaolian.avatr;
      }
    },
  },
  props: {
    jiaarr: Object,
    jiaolian: Object,
  },
  mounted() {
    this.$emit("done");
  },
  created() {
    this.bian();
    this.ur();
  },
};
</script>
<style scoped>
#zong {
  width: 100%;
  height: 14.7vh;
  border-bottom: 0.1vh solid rgb(238, 238, 238);
  display: flex;
  background: white;
}
#middle {
  width: 100%;
  height: 9.8vh;
  display: flex;
  margin-top: 2.5vh;
}
#pic {
  width: 33.4vw;
  height: 100%;
}
#pic > img {
  width: 30vw;
  height: 100%;
}
#wen {
  width: 66.6vw;
  height: 100%;
  display: flex;
}
#wen-left {
  width: 55vw;
  height: 100%;
}
#wen-left > p {
  text-align: left;
  color: rgb(101, 198, 251);
}
#wen-right {
  width: 16.6vw;
  height: 100%;
}
#wen-right > p {
  margin-bottom: 50px;
}
#left-top {
  width: 100%;
  display: flex;
}
#top-jianame {
  font-size: 3vh;
  line-height: 3.9vh;
}
#top-jiao {
  display: none;
  margin-left: 1vw;
  width: 13.1578vw;
  height: 2.17vh;
  border-bottom: 0.1vh solid rgb(29, 172, 249);
  border-top: 0.1vh solid rgb(29, 172, 249);
  border-left: 0.1vw solid rgb(29, 172, 249);
  border-right: 0.1vw solid rgb(29, 172, 249);
  color: rgb(29, 172, 249);
  margin-top: 0.46vh;
}
#top-v {
  margin-left: 1vw;
  width: 25px;
  height: 25px;
  background: url(../assets/v.png);
  background-position: center;
}
#lef-middle {
  width: 100%;
  height: 3.9vh;
  display: flex;
  background-color: white;
}
</style>